<!DOCTYPE HTML>
<html>
<!--_meta 作为公共模版分离出去-->
{include file="common/_meta"}
<!--/meta 作为公共模版分离出去-->

<body>
<header class="navbar-wrapper">
    <div class="navbar navbar-fixed-top">
        <div class="container-fluid cl"> 
            <a class="logo navbar-logo f-l mr-10 hidden-xs" href="{:url('index/index')}">后台管理</a>  
            <span class="logo navbar-slogan f-l mr-10 hidden-xs">v0.1</span>
        </div>
    </div>
</header>

<nav class="breadcrumb"><i class="Hui-iconfont">&#xe63f;</i>
找回密码
</nav>
<section class="Hui-article-box">
    <div class="Hui-article">   
        <article class="cl pd-20">
            <form action='{:url('getpwd')}' method='POST' class="form form-horizontal" id="form-admin-getpwd">
                <div id="tab-system" class="HuiTab">
                    <div class="tabBar cl">
                        <span class="step1 stepbar" style="background:#0a6999;">输入绑定邮箱</span>
                        <span class="step2 stepbar" style="display:none;">获取验证码</span>
                        <span class="step3 stepbar" style="display:none;">设置新密码</span>
                    </div>
                    <div class="martop" style="margin-top:100px;">
                        <!-- step1 -->
                        <div class="tabCon tab1"  style="display:block;"> 
                            <div class="row cl">
                                <label class="form-label col-xs-4 col-sm-1"><span class="c-red">*</span>登陆账号：</label>
                                <div class="formControls col-xs-8 col-sm-2">
                                    <input type="text" id="username" name="username" placeholder="请输入正确的登陆账号" value="" class="input-text">
                                </div>
                                <span class="col-xs-4 col-sm-2 c-red uspan"></span>
                            </div>
                            <div class="row cl">
                                <label class="form-label col-xs-4 col-sm-1"><span class="c-red">*</span>绑定邮箱：</label>
                                <div class="formControls col-xs-8 col-sm-2">
                                    <input type="text" id="email" name="email" placeholder="请输入绑定邮箱" value="" class="input-text">
                                </div>
                                 <a href="index" style="color:rgb(12, 121, 245);">未绑定邮箱请联系系统管理员</a>
                                 <span class="col-xs-4 col-sm-2 c-red espan"></span>
                            </div>
                            <div class="row cl">
                                <div class="col-xs-4 col-sm-4 col-xs-offset-1 col-sm-offset-1">
                                    <input type="button" id='mail_button' class="btn btn-primary radius" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <a href="index" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</a>
                                </div>
                            </div>
                        </div>
                        <!-- step1  end-->
                        <!-- step2 -->
                        <div class="tabCon tab2" >
                            <div class="row cl">
                                <label class="form-label col-xs-4 col-sm-1"><span class="c-red">*</span>请输入验证码：</label>
                                <div class="formControls col-xs-8 col-sm-2">
                                    <input type="text" id="email_code" name="email_code" placeholder="请输入有效的验证码" value="" class="input-text">
                                </div>
                                <span class="col-xs-4 col-sm-2 c-red cspan"></span>
                            </div>
                            <div class="row cl">
                                <div class="col-xs-4 col-sm-4 col-xs-offset-1 col-sm-offset-1">
                                    <input type="button" id='code_button' class="btn btn-primary radius" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <a href="index" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</a>
                                </div>
                            </div>
                        </div>
                        <!-- step2  end-->
                        <!-- step3 -->
                        <div class="tabCon tab3">
                            <div class="row cl">
                                <label class="form-label col-xs-4 col-sm-1"><span class="c-red">*</span>新密码：</label>
                                <div class="formControls col-xs-8 col-sm-2">
                                    <input type="password" id="userpwd" name="password" placeholder="请输入新密码" value="" class="input-text">
                                </div>
                                <span class="col-xs-4 col-sm-4 c-red pspan"></span>
                            </div>
                            <div class="row cl">
                                <label class="form-label col-xs-4 col-sm-1"><span class="c-red">*</span>确认密码：</label>
                                <div class="formControls col-xs-8 col-sm-2">
                                    <input type="password" id="repassword" name="repassword" placeholder="请再次确认密码" value="" class="input-text">
                                </div> 
                                <span class="col-xs-4 col-sm-2 c-red rspan"></span>
                            </div>
                            <div class="row cl">
                                <div class="col-xs-4 col-sm-4 col-xs-offset-1 col-sm-offset-1">
                                    <input type="submit" id='pwd_button' class="btn btn-primary radius" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <a href="index" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</a>
                                </div>
                            </div>
                        </div>
                        <!-- step3  end-->
                    </div>
                </div>
            </form>
        </article>
    </div>
</section>

<!--_footer 作为公共模版分离出去-->
{include file="common/_footer" /}
<!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本--> 
<script type="text/javascript" src="/static/js/login.js"></script>
<script type="text/javascript">
$('#mail_button').click(function(){
    var username=checkUsername();
    var email=checkEmail();
    
    if(!username) return false;
    if(!email) return false;
    
    $.ajax({
        type:"POST",
        url:"{:url('sendMailCode')}",
        data:{'username':username,'email':email},
        dataType:"json",
        success:function(data){
            if(data.status==1){
                $('.step2').css('display','block');
                $('.stepbar').css('background','#e8e8e8');
                $('.step2').css('background','#0a6999');
                $('.tabCon').css('display','none');
                $('.tab2').css('display','block');
                layer.msg(data.msg,{icon:6,time:2000});
            }else{
                $('.cspan').html(data.msg);
                return false;
            }
        }
    });
    return false;
})

$('#code_button').click(function(){
    var email_code=checkEmailCode();

    if(!email_code) return false;
    
    $.ajax({
        type:"POST",
        url:"{:url('checkEmailCode')}",
        data:{'email_code':email_code},
        dataType:"json",
        success:function(data){
            if(data.status==1){
                $('.step3').css('display','block');
                $('.stepbar').css('background','#e8e8e8');
                $('.step3').css('background','#0a6999');
                $('.tabCon').css('display','none');
                $('.tab3').css('display','block');
            }else{
                $('.cspan').html(data.msg);
                return false;
            }
        }
    });
    return false;
})

$('#form-admin-getpwd').submit(function(){
    var pwd=checkPwd();
    if(!pwd) return false;
    var repwd=$('#repassword').val();
    if(pwd!=repwd){
        return false;
    }
})

</script>
<!--请在上方写此页面业务相关的脚本--> 
</body>
</html>